<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<meta name="viewport" content="width=device-width,user-scalable=no, initial-scale=1">
		<title>CRM</title>
		<link rel="stylesheet" type="text/css" href="/azxcrm/css/wap/mui.min.css" th:href="@{/azxcrm/css/wap/mui.min.css}"/>
        <link rel="stylesheet" type="text/css" href="/azxcrm/css/wap/mui.picker.min.css" th:href="@{/azxcrm/css/wap/mui.picker.min.css}"/>
		<link rel="stylesheet" type="text/css" href="../static/azxcrm/css/wap/aui.css" th:href="@{/azxcrm/css/wap/aui.css}" />
		<link rel="stylesheet" type="text/css" href="../static/azxcrm/css/wap/aui.css" th:href="@{/azxcrm/css/wap/changePassword.css}" />
		<link rel="stylesheet" type="text/css" href="//at.alicdn.com/t/font_835360_8flqp9ignrc.css"/>
		<script src="/azxcrm/js/wap/mui.min.js" th:src="@{/azxcrm/js/wap/mui.min.js}" type="text/javascript" charset="utf-8"></script>
        <script src="/azxcrm/js/wap/mui.picker.min.js" th:src="@{/azxcrm/js/wap/mui.picker.min.js}" type="text/javascript" charset="utf-8"></script>
		<script src="../static/azxcrm/js/wap/jquery-3.3.1.min.js" type="text/javascript" th:src="@{/azxcrm/js/wap/jquery-3.3.1.min.js}"></script>
		<script src="../static/ajax/libs/validate/jquery.validate.min.js" th:src="@{/ajax/libs/validate/jquery.validate.min.js}"></script>
		<script src="../static/ajax/libs/validate/messages_zh.min.js" th:src="@{/ajax/libs/validate/messages_zh.min.js}"></script>
		<script th:inline="javascript"> var ctx = [[@{/}]]; </script>   
		<style>
			.fontColor{color: #03a9f4;}
			#oldPassword-error,#password-error,#confirm-error{position:relative;top:-0.2rem;text-align:center;color:red;display:inline-block;width:100%;}
		    #confirm{padding-left: 1.9rem;}
		    #password{padding-left: 2.4rem;}
		</style>
	</head>
	<body>
		<header class="aui-bar aui-bar-nav">
			 <a href="javascript:history.back(-1)"  class="aui-pull-left aui-btn">
	       		 <span class="iconfont icon-fanhui1">返回</span>
	    	</a>
		    <div class="aui-title">修改密码</div>
		</header>
		<div class="aui-content aui-margin-b-15">
			<form id="signupForm">
			<input name="userId"  type="hidden"  th:value="${user.userId}" />
			<input name="loginName"  type="hidden"  th:value="${user.loginName}" />
				<ul class="aui-list aui-form-list">
					<li class="aui-list-item">
						<div class="aui-list-item-inner">
							<div class="aui-list-item-label-icon">原密码</div>
							<div class="aui-list-item-input">
								    <input class="form-control" type="password" name="oldPassword" id="oldPassword" placeholder="请输入原始密码">							
							</div>
						</div>
					</li>
					<div></div>
					<li class="aui-list-item">
						<div class="aui-list-item-inner">
							<div class="aui-list-item-label-icon">新密码</div>
							<div class="aui-list-item-input"> 
                                <input class="form-control password" type="password" name="password" id="password" placeholder="请输入密码">							
							</div>
							<div class="aui-list-item-label-icon item-label">
								<i class="iconfont icon-iconset0207 Eye"></i>
							</div>
						</div>
					</li>
					<div></div>
					<li class="aui-list-item">
						<div class="aui-list-item-inner">
							<div class="aui-list-item-label-icon">确认密码</div>
							<div class="aui-list-item-input">
							     <input class="form-control password" type="password" name="confirm" id="confirm" placeholder="请输入密码">
							</div>
							<div class="aui-list-item-label-icon item-label">
								<i class="iconfont icon-iconset0207 Eye"></i>
							</div>
						</div>
					</li>
					<div></div>
				</ul>
				<div class="aui-content-padded">
					<div class="aui-btn aui-btn-info aui-btn-block" id='toastBtn' type="button" onclick="return check(this.form)">提交</div>
				</div>
			</form>
		</div>
	</body>
</html>
<script>
var onChange =  function (){   	          
  	$(".Eye").click(function(){       		
  		if($(this).hasClass("fontColor")) {
  				$(this).removeClass("fontColor").parent(".item-label").siblings(".aui-list-item-input").find(".password").attr("type","password")     			
  		}else{
  			$(this).addClass("fontColor").parent(".item-label").siblings(".aui-list-item-input").find(".password").attr("type","text")     		
  		}       
 	})
	}();
$("#signupForm").validate({
    rules:{
        oldPassword:{
            required:true,
            minlength: 6,
            remote: {
                url: ctx + "wap/order/checkPassword",
                type: "get",
                dataType: "json",
                data: {
                    password: function() {
                        return $("input[name='oldPassword']").val();
                    }
                }
            }
        },
        password: {
            required: true,
            minlength: 6
        },
        confirm: {
            required: true,
            equalTo: "#password"
        }
    },
    messages: {
        oldPassword: {
            required:"请输入原密码",
            remote: "原密码错误"
        },
        password: {
            required: "请输入新密码",
            minlength: "密码不能小于6个字符"
        },
        confirm: {
            required: "请再次输入新密码",
            equalTo:"两次密码输入不一致"
        }

    },
	errorPlacement: function(error, element) {  
	    error.appendTo(element.parent().parent().parent().next()); 
	},
	

});

function check(form){
    $.ajax({
        cache : true,
        type : "post",
        url : ctx + "wap/order/resetPassword",
        data : $('#signupForm').serialize(),
        async : false,
        error : function(request) {
            parent.layer.alert("系统错误");
        },
        success : function(data) {
        	if (data.code == 0) {
                mui.toast("修改成功");                          
                $("#toastBtn").removeAttr("onclick");
                    setTimeout(function(){
                        window.location.href= ctx + "/wap/wapMy"
                        },2200) 
            } else {
                mui.toast("添加失败");
            }
            }
        
    });
}
</script>
